@{
    ViewData["Title"] = "编辑生产领料";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>编辑生产领料</title>
    <script src="~/libs/scripts/jquery-3.4.1.min.js"></script>
    <link href="~/libs/scripts/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
    <script src="~/libs/scripts/layui-v2.5.6/layui/layui.js"></script>
    <style>
        body {
            margin: 0;
            padding: 20px;
            background: #f5f7fa;
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
        }

        .form-container {
            background: white;
            border-radius: 8px;
            box-shadow: 0 1px 3px rgba(0,0,0,0.1);
            overflow: hidden;
        }

        .form-header {
            padding: 20px;
            background: #f8fafd;
            border-bottom: 1px solid #f0f0f0;
        }

        .form-title {
            font-size: 16px;
            font-weight: 500;
            color: #333;
            margin: 0;
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .form-content {
            padding: 20px;
        }

        .layui-form-item {
            margin-bottom: 20px;
        }

        .layui-form-label {
            width: 120px;
            font-weight: 500;
            color: #333;
        }

        .layui-input,
        .layui-select,
        .layui-textarea {
            border: 1px solid #e5e7eb;
            border-radius: 6px;
            transition: all 0.2s;
        }

        .layui-input:focus,
        .layui-select:focus,
        .layui-textarea:focus {
            border-color: #1677ff;
            box-shadow: 0 0 0 2px rgba(22,119,255,0.1);
        }

        .required::before {
            content: '*';
            color: #ff4d4f;
            margin-right: 4px;
        }

        .form-actions {
            padding: 20px;
            border-top: 1px solid #f0f0f0;
            text-align: right;
            background: #fafafa;
        }

        .btn-primary {
            background: #1677ff;
            border: none;
            color: white;
            padding: 8px 20px;
            border-radius: 6px;
            cursor: pointer;
            font-size: 14px;
            transition: all 0.2s;
        }

        .btn-primary:hover {
            background: #4096ff;
        }

        .btn-secondary {
            background: white;
            border: 1px solid #e5e7eb;
            color: #666;
            padding: 8px 20px;
            border-radius: 6px;
            cursor: pointer;
            font-size: 14px;
            transition: all 0.2s;
            margin-left: 10px;
        }

        .btn-secondary:hover {
            border-color: #1677ff;
            color: #1677ff;
        }

        .search-btn {
            background: #f0f0f0;
            border: 1px solid #d9d9d9;
            color: #666;
            padding: 6px 12px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 12px;
            margin-left: 8px;
        }

        .search-btn:hover {
            background: #e6f7ff;
            border-color: #1677ff;
            color: #1677ff;
        }

        .loading {
            text-align: center;
            padding: 50px;
            color: #999;
        }
    </style>
</head>
<body>
    <div class="form-container">
        <div class="form-header">
            <h2 class="form-title">
                <i class="layui-icon layui-icon-edit"></i>
                编辑生产领料
            </h2>
        </div>

        <div class="form-content">
            <div id="loadingDiv" class="loading">
                <i class="layui-icon layui-icon-loading-1 layui-anim layui-anim-rotate layui-anim-loop"></i>
                数据加载中...
            </div>

            <form class="layui-form" id="editForm" lay-filter="editForm" style="display: none;">
                <input type="hidden" name="id" id="recordId">
                
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">领料单编号</label>
                            <div class="layui-input-block">
                                <input type="text" name="issuanceOrderCode" placeholder="请输入领料单编号" 
                                       autocomplete="off" class="layui-input" lay-verify="required" lay-reqtext="领料单编号不能为空">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">领料单名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="issuanceOrderName" placeholder="请输入领料单名称" 
                                       autocomplete="off" class="layui-input" lay-verify="required" lay-reqtext="领料单名称不能为空">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">领料日期</label>
                            <div class="layui-input-block">
                                <input type="text" name="issuanceDate" id="issuanceDate" placeholder="请选择领料日期" 
                                       autocomplete="off" class="layui-input" lay-verify="required" lay-reqtext="领料日期不能为空">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">领料仓库</label>
                            <div class="layui-input-block">
                                <select name="issuanceWarehouse" lay-verify="required" lay-reqtext="领料仓库不能为空" lay-search>
                                    <option value="">请选择领料仓库</option>
                                    <option value="主仓库">主仓库</option>
                                    <option value="原材料仓库">原材料仓库</option>
                                    <option value="半成品仓库">半成品仓库</option>
                                    <option value="成品仓库">成品仓库</option>
                                    <option value="备件仓库">备件仓库</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label required">生产工单</label>
                            <div class="layui-input-block">
                                <div style="display: flex; align-items: center;">
                                    <input type="text" name="productionWorkOrder" id="productionWorkOrder" 
                                           placeholder="请输入生产工单" autocomplete="off" 
                                           class="layui-input" lay-verify="required" lay-reqtext="生产工单不能为空" 
                                           style="flex: 1;">
                                    <button type="button" class="search-btn" id="searchWorkOrder">
                                        <i class="layui-icon layui-icon-search"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label">客户编码</label>
                            <div class="layui-input-block">
                                <input type="text" name="customerCode" placeholder="请输入客户编码" 
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label">客户名称</label>
                            <div class="layui-input-block">
                                <input type="text" name="customerName" placeholder="请输入客户名称" 
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label">生产任务</label>
                            <div class="layui-input-block">
                                <input type="text" name="productionTask" placeholder="请输入生产任务" 
                                       autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label">工作站</label>
                            <div class="layui-input-block">
                                <select name="workstation" lay-search>
                                    <option value="">请选择工作站</option>
                                    <option value="工作站A">工作站A</option>
                                    <option value="工作站B">工作站B</option>
                                    <option value="工作站C">工作站C</option>
                                    <option value="工作站D">工作站D</option>
                                </select>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">备注</label>
                    <div class="layui-input-block">
                        <textarea name="remark" placeholder="请输入备注信息" class="layui-textarea" 
                                  style="min-height: 80px;"></textarea>
                    </div>
                </div>
            </form>
        </div>

        <div class="form-actions">
            <button type="button" class="btn-primary" id="submitBtn">
                <i class="layui-icon layui-icon-ok"></i> 更新
            </button>
            <button type="button" class="btn-secondary" id="cancelBtn">
                <i class="layui-icon layui-icon-close"></i> 取消
            </button>
        </div>
    </div>

    <script>
        layui.use(['form', 'laydate', 'layer'], function () {
            var form = layui.form;
            var laydate = layui.laydate;
            var layer = layui.layer;

            // 获取URL参数
            function getUrlParam(name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if (r != null) return unescape(r[2]);
                return null;
            }

            var recordId = getUrlParam('id');
            if (!recordId) {
                layer.msg('缺少记录ID参数', { icon: 2 });
                return;
            }

            // 初始化日期选择器
            laydate.render({
                elem: '#issuanceDate',
                type: 'date'
            });

            // 加载数据
            loadData();

            function loadData() {
                $.ajax({
                    url: '/ProductionSystem/ProductionMaterial/Get?id=' + recordId,
                    type: 'GET',
                    success: function (res) {
                        if (res.code === 0) {
                            var data = res.data;
                            
                            // 填充表单数据
                            $('#recordId').val(data.id);
                            $('input[name="issuanceOrderCode"]').val(data.issuanceOrderCode);
                            $('input[name="issuanceOrderName"]').val(data.issuanceOrderName);
                            $('input[name="issuanceDate"]').val(data.issuanceDate ? new Date(data.issuanceDate).toLocaleDateString('zh-CN') : '');
                            $('select[name="issuanceWarehouse"]').val(data.issuanceWarehouse);
                            $('input[name="productionWorkOrder"]').val(data.productionWorkOrder);
                            $('input[name="customerCode"]').val(data.customerCode);
                            $('input[name="customerName"]').val(data.customerName);
                            $('input[name="productionTask"]').val(data.productionTask);
                            $('select[name="workstation"]').val(data.workstation);
                            $('textarea[name="remark"]').val(data.remark);

                            // 重新渲染表单
                            form.render();

                            // 隐藏加载提示，显示表单
                            $('#loadingDiv').hide();
                            $('#editForm').show();
                        } else {
                            layer.msg('获取数据失败：' + res.msg, { icon: 2 });
                        }
                    },
                    error: function () {
                        layer.msg('获取数据失败，请检查网络连接', { icon: 2 });
                    }
                });
            }

            // 搜索生产工单
            $('#searchWorkOrder').on('click', function () {
                layer.msg('工单选择功能待实现', { icon: 0 });
            });

            // 提交表单
            $('#submitBtn').on('click', function () {
                // 验证表单
                var formData = form.val('editForm');
                
                // 检查必填字段
                if (!formData.issuanceOrderCode) {
                    layer.msg('请输入领料单编号', { icon: 2 });
                    return;
                }
                if (!formData.issuanceOrderName) {
                    layer.msg('请输入领料单名称', { icon: 2 });
                    return;
                }
                if (!formData.issuanceDate) {
                    layer.msg('请选择领料日期', { icon: 2 });
                    return;
                }
                if (!formData.issuanceWarehouse) {
                    layer.msg('请选择领料仓库', { icon: 2 });
                    return;
                }
                if (!formData.productionWorkOrder) {
                    layer.msg('请输入生产工单', { icon: 2 });
                    return;
                }

                // 转换日期格式
                formData.issuanceDate = new Date(formData.issuanceDate).toISOString();

                var loadIndex = layer.load(2, { shade: [0.3, '#000'] });

                $.ajax({
                    url: '/ProductionSystem/ProductionMaterial/Update/' + recordId,
                    type: 'PUT',
                    contentType: 'application/json',
                    data: JSON.stringify(formData),
                    success: function (res) {
                        layer.close(loadIndex);
                        if (res.code === 0) {
                            layer.msg('更新成功', { icon: 1 }, function () {
                                // 关闭弹窗
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                            });
                        } else {
                            layer.msg('更新失败：' + res.msg, { icon: 2 });
                        }
                    },
                    error: function () {
                        layer.close(loadIndex);
                        layer.msg('更新失败，请检查网络连接', { icon: 2 });
                    }
                });
            });

            // 取消按钮
            $('#cancelBtn').on('click', function () {
                var index = parent.layer.getFrameIndex(window.name);
                parent.layer.close(index);
            });
        });
    </script>
</body>
</html> 